import React, { Component } from 'react'
import { Modal, Form, Button } from 'antd'
import PropTypes from 'prop-types'
import _ from 'loadsh'
import style from './AgentShower.module.less'
const { Item } = Form
export default class AgentShower extends Component {
  state = {
    info: null
  }

  formatInfo () {
    const data = _.cloneDeep(this.props.data)
    this.setState({
      info: data
    })
  }

  componentDidUpdate (prev) {
    if (this.props.data && prev.data !== this.props.data) {
      this.formatInfo()
    }
  }

  componentDidMount () {
    if (this.props.data) {
      this.formatInfo()
    }
  }

  render () {
    if (!this.state.info) {
      return false
    }
    const info = this.state.info
    const party = info.party || []
    const person = party.map(li => li.name).join('、')
    return (
      <Modal
        title={`${info.party_type}代理人详情`}
        open={this.props.data}
        footer={<Button type='primary' onClick={() => this.props.hide()}>确定</Button>}
        onCancel={() => this.props.hide()}
        maskClosable={false}
      >
        <Form className={style.form}>
          <Item label={`${info.party_type}名称`}>
            <div className={style.text}>{person || '无'}</div>
          </Item>
          <Item label='代理人姓名'>
            <div className={style.text}>{info.name || '无'}</div>
          </Item>
          <Item label='证件类型'>
            <div className={style.text}>{info.license_type || '无'}</div>
          </Item>
          <Item label='证件号码'>
            <div className={style.text}>{info.license || '无'}</div>
          </Item>
          <Item label='所在单位'>
            <div className={style.text}>{info.structure || '无'}</div>
          </Item>
          <Item label='地址'>
            <div className={style.text}>{info.address || '无'}</div>
          </Item>
          <Item label='手机号码'>
            <div className={style.text}>{info.mobile || '无'}</div>
          </Item>
          <Item label='邮箱'>
            <div className={style.text}>{info.email || '无'}</div>
          </Item>
          <Item label='固定电话'>
            <div className={style.text}>{info.tel || '无'}</div>
          </Item>
        </Form>
      </Modal>
    )
  }
}

AgentShower.propTypes = {
  hide: PropTypes.func,
  data: PropTypes.object
}
AgentShower.defaultProps = {
  hide: () => {},
  data: null,
  partyList: []
}
